<template>
  <div>
    <h1>试题</h1>
    <div v-for="item in answer" :key="item.questionNo">
      <h2>{{item.subject}}</h2>
      <div v-if="item.questionType === 1">
        <!-- 单选 -->
          <el-radio-group v-model="item.answer">
            <el-radio v-for="child in item.choice" :key="child" :label="child">{{child}}</el-radio>
          </el-radio-group>
      </div>
      <div v-else-if="item.questionType === 2">
         <!-- 多选 -->
          <el-checkbox-group v-model="item.answer">
            <el-checkbox v-for="child in item.choice" :key="child" :label="child">{{child}}</el-checkbox>
          </el-checkbox-group>
      </div>
      <div v-else>
        其他题型
      </div>
    </div>
  </div>
</template>

<script>
import data from './exam-data'

export default {
  name: 'exam',
  data () {
    return {
      data: data,
      answer: [],
    }
  },
  created  () {
    this.answer = this.data.map(item => {
      item.answer = item.questionType == 2 ? [] : ''
      item.choice = []
      Object.keys(item).forEach(child => {
        if (child.indexOf('choiceOp') > -1 && item[child]) {
          item.choice.push(item[child])
        }
      })
      return item
    })
  }
}
</script>

<style>

</style>
